<html>
<head>
<title>expocial</title>
<script src="services.js" type="text/javascript"></script>
<link rel="stylesheet" href="frames.css" type="text/css">

</head>
<style type="text/css">
body {
	background:
		url(http://demo.marcofolio.net/css3_tabbed_nav/images/wood_bg.jpg);
	overflow: hidden;
}

#logos {
	position: absolute;
	left: 0px;
	bottom: 0px;
	padding: 10px;
}

#logos img {
	width: 100px;
	height: auto;
	opacity: 0.3;
	-webkit-transition: opacity 1s ease-in-out;
}

.highlight {
	opacity: 1 !important;
}
</style>

<body>
<div id='logos'>
<div id='loadingbay' style="opacity: 0;"></div>
<img id='moby' src='images/moby.png' alt="" /> <img id='hyves'
	src='images/hyves.png' alt="" /> <img id='twitter'
	src='images/twitter.png' alt="" /></div>
</body>

<script src="ani.js" type="text/javascript"></script>
<script type="text/javascript">
	var radius = 500; //500 meters
	var latitude = 52.369989; //tnw hackathon location
	var longitude = 4.884238; //tnw hackathon location

	var retryTwitterService = 10000; //10sec
	var retryMobypictureService = 60000; //60sec

	var twitterService = new TwitterService();
	var executeTwitterRetrieve = function(timeout) {
		twitterService.retrieveItems(false, {
			latitude : latitude,
			longitude : longitude,
			radius : radius
		}, function() {
			setTimeout(executeTwitterRetrieve, retryTwitterService);
		});
	}
	setTimeout(executeTwitterRetrieve, 0);
	var mobypictureService = new MobypictureService();
	var executeMobypictureRetrieve = function(timeout) {
		mobypictureService.retrieveItems(false, {
			latitude : latitude,
			longitude : longitude,
			radius : radius
		}, function() {
			setTimeout(executeMobypictureRetrieve, retryMobypictureService);
		});
	}
	setTimeout(executeMobypictureRetrieve, 0);
</script>
</html>